<template>
  <article class="page">
    <headerbar>党务知识</headerbar>

    <section class="frame-content bg-light-gray list-news-img bg-white">
      <fetchData  class="project-tip" :loading="isLoading" :data="list"></fetchData>
      <abnormal  @refresh="fetchList" v-if="abnormal"></abnormal>
      <cube-scroll
        ref="scroll"
        :options="options"
        @pulling-up="onPullingUp"
        @pulling-down="onPullingDown"
        :scrollEvents="['scroll-end']"
        v-remainScrollCube="'policyDocument'"
      >
        <div class="item" @click="goDetail(item)" v-for="(item,index) in list" :key="index">
          <div class="img">
            <img v-if="!item.listPic" src="../../../../static/images/user_bg.jpg" alt="">
            <img v-if="item.listPic" :src="tools.getImgUrl(item.listPic)" alt="">
          </div>
          <div class="cont">
            <h2 class="title">{{item.title}}</h2>
            <div class="tip" v-if="item.zhuanji != 1">
              <span>{{item.source}}</span>
              <span>{{tools.formatDate(item.createTime)}}</span>
<!--              <span>阅读  {{item.views || 0}}</span>-->
              <broadcast :item="item"/>
            </div>
          </div>
        </div>
        <noData v-if="!isLoading && list.length === 0"></noData>
        <onBottom v-else-if="onBottom"></onBottom>
        <!--<div class="item" v-for="item in 10">
          <div class="img">
            <img src="../../../../static/images/user_bg.jpg" alt="">
          </div>
          <div class="cont">
            <h2 class="title">人事动态人事动态人事动态人事动态人事动态人事动态</h2>
            <div class="tip">
              <span>人民网</span>
              <span>2052-5-4</span>
            </div>
          </div>
        </div>-->
      </cube-scroll>

      <div class="problem-setting-btn" @click="partyKnowledge()">
        <div class="text">
          党务热点
        </div>
      </div>
    </section>
    <footerbar></footerbar>
  </article>
</template>


<script>
  import footerbar from '@/components/layout/footerbar.vue'
  export default {
    components: {footerbar},
    name: 'policyDocument',
    data () {
      return {
        list: [],
        files: [],
        attachmentList: [],
        channelId: '8',
        currentIndex: 1,
        pageIndex: 1,
        pageSize: 10,
        abnormal: false,
        isLoading: true,
        isSort: false,
        onBottom: false,
        orderBy:'',
        sort:'',
        detail: {},
        options: {
          pullUpLoad: true,
          pullDownRefresh: {
            threshold: 90,
            stop: 0,
            txt: " ",
          },
          scrollbar: false
        },
        flag: true
      }
    },
    created () {
      this.channelId = this.$route.params.id
      this.$route.meta.keepAlive = true
      this.fetchList()
    },
    beforeRouteEnter (to, from, next) {
      next(vm => {
        if (to.name === 'policyDocument') {
          to.meta.keepAlive = true
          vm.$store.commit('addRoute', 'policyDocument')
        }
      })
    },
    beforeRouteLeave(to, from, next){
      console.log('to.nameto.name',to.name);
      this.$route.meta.keepAlive = to.name === 'policyActivityDetail' || to.name === 'policyDocumentList'
      if(this.$route.meta.keepAlive) {
        this.$store.commit('addRoute','policyDocument')
      }else {
        this.$store.commit('removeRoute','policyDocument')
        this.$destroy()
      }
      next()
    },
    methods: {
      goDetail (item) {
        if (item.zhuanji === 1) {
          this.$router.push({path: `/policyDocumentList/${item.id}`})
        } else {
          item.views++
          this.$store.state.specialDetail = item
          this.$router.push({name: 'policyActivityDetail', query: {id: item.id, flag: 3}})
        }
      },
      fetchList (id) {
        this.onBottom = false;
        this.abnormal = false
        this.isLoading = true
        id = id || this.channelId
        let data = {
          channelId: id || '',
          pageNo: this.pageIndex,
          pageSize: this.pageSize,
          orderBy: this.orderBy,
          sort: this.sort,
        }
        // debugger
        // let apiMethodName = !this.isSort ? 'contentPage' : 'contentGetSortNo'//请求原来的接口
        let apiMethodName = !this.isSort ? 'specialList' : 'contentGetSortNo' //请求带合集的接口
        this.fetchService.specialList(data).then(res => {
          this.isLoading = false
          if (res.code !== 0) {
            if (res.code == 444) {
              this.abnormal = true
            }else {
              return this.tools.alert(res.message || res.resp_msg || '接口出错，请联系管理员')
            }
          }
          if (res.code === 0 && res.data.page.length < 1 && res.data.album.length < 1) {
            this.options.pullUpLoad = false
            this.onBottom = true;
            this.$refs.scroll.forceUpdate && this.$refs.scroll.forceUpdate();
            return;
          }
          if (res.data.album && res.data.album.length > 0) {
            res.data.album.map((v) => {
              v.title = v.channelName
              v.listPic = v.pic
              v.zhuanji = 1
            })
            this.list = this.list.concat(res.data.album)
          }
          this.list = this.list.concat(res.data.page)
          if (res.data.page !=null && res.data.page.length === 0) {
            // this.tools.tip('暂无更多')
          }
          this.pageIndex++;
          setTimeout(() => {
            this.$refs.scroll.forceUpdate &&
            this.$refs.scroll.forceUpdate(true, false);
          }, 100);
        })
      },
      partyKnowledge () {
        this.flag = false
        this.pageIndex = 1
        this.orderBy ='views_',
        this.sort = 'desc'
        this.list = []
        this.fetchList()
        // this.dangWuPages()
      },
      dangWuPages () {
        this.isLoading = true
        let data = {
          orderBy: 'views_',
          pageNo: this.pageIndex,
          pageSize: this.pageSize,
          sort: 'desc'
        }
        this.fetchService.dangWuPage(data).then(res => {
          if (res.code !== 0) {
            return this.tools.alert(res.message || res.resp_msg || '接口出错，请联系管理员')
          }
          this.isLoading = false
          this.pageIndex++
          this.list = this.list.concat(res.data.page)
          if (res.data.page.length === 0) {
            this.tools.tip('暂无更多')
            this.options.pullUpLoad = false;
          }
          setTimeout(() => {
            this.$refs.scroll.forceUpdate && this.$refs.scroll.forceUpdate(true, false)
          }, 100)
        })
      },
      hasList () {
        return this.list.length > 0 || this.topList.length > 0
      },
      onPullingUp () {
        console.log("onPullingUp");
        // this.dangWuPages();
        this.fetchList()
      },
      onPullingDown() {
        this.list = [];
        this.options.pullUpLoad = true;
        console.log("onPullingDown");
        this.pageIndex = 1;
        this.fetchList()
      },
    }
  }
</script>

<style scoped>

</style>
